import React, {useState,useEffect,useRef} from 'react'

const set = new Set()
function StateFunction() {
  const [num, setNum] = useState(1)

  // 1. 保存一个值，在整个生命周期中维持不变，
  // 2. 重新赋值ref.current 不会触发重新渲染。
  const ref = useRef()
  console.log('ref')
  console.log(ref)
  let timer
  useEffect(() => {
    // ref.current = setInterval(() => {
    //   setNum(num => num + 1)
    // }, 400)
    ref.current = '111'
    console.log('ref')
    console.log(ref)
  }, [])

  useEffect(()=>{
    if(num > 10) {
      console.log('超过10了',ref.current)
      clearInterval(ref.current)
    }
  },[num])

  return <div onClick={()=>{setNum((num)=>num+1)}}>
    这是一个MemoFunction函数组件-{num},ref.current: {ref.current}
  </div>
}

export default StateFunction